<template>
  <div>
    <h2>用户抽奖</h2>
    <div>
      <h1>活动名称：{{ activeInfo.activeName }}</h1>
    </div>
    <div>
      <h1>活动开始时间：{{ activeInfo.beginTime }}</h1>
    </div>
    <div>
      <h1>活动结束时间：{{ activeInfo.endTime }}</h1>
    </div>
    <div>
      <h1>活动积分：{{ activeInfo.payScore }}</h1>
    </div>
    <div>
      <h1>活动免费次数：{{ activeInfo.freeTimes }}</h1>
    </div>
    <div>
      <h1>
        活动状态：<span style="color: red">{{
          activeInfo.activeStatus == 0 ? "活动正常" : "活动停止"
        }}</span>
      </h1>
    </div>
    <div>
      <el-button
        type="primary"
        :disabled="activeInfo.payScore > userInfo.userScore"
        @click="onJoinScoreActive"
        >积分抽奖</el-button
      >
      <el-button
        type="primary"
        :disabled="activeInfo.winFlag == 0"
        @click="onShowRecord"
        >中奖名单</el-button
      >
      <el-button
        type="primary"
        :disabled="activeInfo.winRecord == 0"
        @click="onShowProd"
        >中奖奖品</el-button
      >
    </div>
  </div>
</template>

<script setup lang="ts">
import { onMounted, ref } from "vue";
import { getActiveById,getUserInfo,joinActiveByScore } from "../api/api";
import { ElMessage } from "element-plus";
import { useRouter } from "vue-router";

const router = useRouter();

const activeInfo = ref({
  activeId: 0,
  payScore: 0,
  activeName: "",
  beginTime: "",
  endTime: "",
  freeTimes: 0,
  activeStatus: 0,
  winFlag:0,
  winRecord:0,
});
const activeId = ref(0);
const userInfo = ref({
  userId: 0,
  userName: "",
  userScore: 0,
});

//中奖奖品
const onShowProd = () => {
    router.push("/home/record");
}

//中奖名单
const onShowRecord = () => {
    ElMessage.success("中奖奖品")
}

//积分抽奖
const onJoinScoreActive = () => {
    joinActiveByScore(activeInfo.value.activeId).then(res=>{
        if(res.data.code == 200){
            ElMessage.success(res.data.msg);
            console.log(res.data.msg);
            
            loadActiveInfo();
        }else{
            ElMessage.error(res.data.msg);
        }
    })
}

const loadActiveInfo = () => {
  //获取当前用户信息
  getUserInfo().then((res) => {
    if (res.data.code == 200) {
      userInfo.value = res.data.data;
    }
  });
  getActiveById(activeId.value).then((res) => {
    if (res.data.code == 200) {
      activeInfo.value = res.data.data;
    }
  });
};

onMounted(() => {
  //获取活动那个ID
  activeId.value = sessionStorage.getItem("activeId");
  //加载活动信息
  loadActiveInfo();
});
</script>

<style scoped></style>
